<template>
  <div class="search-content">
    <n-grid cols="24" item-responsive responsive="screen">
      <n-grid-item span="20 s:16 m:14 l:10 xl:8 2xl:8" offset="2 s:4 m:5 l:7 xl:8 2xl:8" style="text-align: left;">
        <n-input-group class="input-style">

            <n-popselect
              v-model:value="searchOptionValue"
              :options="searchOptions"
              size="medium"
              scrollable
            >
              <n-button type="primary" >
                {{ searchOptionValue }}
              </n-button>
            </n-popselect>
          <n-input v-model:value="searchValue" @keyup.enter.native="search" placeholder="">
            <template #prefix>
              <n-icon :component="SearchOutlined"/>
            </template>
          </n-input>
          <n-button type="primary" ghost @click="search">
            搜索
          </n-button>
        </n-input-group>


        <n-collapse-transition :show="showSearchContent">
          感知度，方法论，组合拳，引爆点，点线面，精细化，差异化，平台化，结构化，影响力，耦合性，便捷性，一致性，端到端，短平快，护城河，体验感，颗粒度
        </n-collapse-transition>
      </n-grid-item>
    </n-grid>
  </div>
</template>

<script lang="ts" src="./script.ts"></script>

<style scoped>@import './style.css';</style>
